<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>欢迎 ( ´･･)ﾉ(._.`)</title>
  <link rel="shortcut icon" href="public/images/favicon.ico" type="image/x-icon" />
  <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css">
  <link rel="stylesheet" href="/public/css/login.css">
</head>

<body>
  <div class="main">
    <div class="header">
      <h1>用户登录</h1>
    </div>
    <form id="login_form">
      <div class="form-group">
        <label for="">邮箱</label><span style="color: red;margin-left: 20px;"></span>
        <input type="email" class="form-control" id="email" name="email" placeholder="Email" autofocus>
      </div>
      <div class="form-group">
        <label for="">密码</label>
        <a class="pull-right" id="forget-password" href="javascript:;">忘记密码？</a>
        <input type="password" class="form-control" id="password" name="password" placeholder="Password">
        <span style="color: red;float: right;"></span>
      </div>
      <div class="checkbox">
        <label>
          <input type="checkbox">记住我
        </label>
      </div>
      <button type="submit" class="btn btn-success btn-block">登录</button>
    </form>
    <div class="message">
      <p>没有账号? <a href="/register">点击创建</a>.</p>
    </div>
  </div>
  <script src="/node_modules/jquery/dist/jquery.js"></script>
  <script>
    let email = $('#email')
    let password = $('#password')
    email.on('keyup',function(e){
      email.prev().html('')
      let emailReg = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
      if( !emailReg.test($(this).val()) ){
        email.prev().html('您输入的邮箱格式不正确')
      }
    })
    password.on('keyup',function(e){
      password.next().html('')
      // let emailReg = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
      // if( !emailReg.test($(this).val()) ){
      //   email.prev().html('您输入的邮箱格式不正确')
      // }
    })
    $('#forget-password').on('click',function(e){
      e.preventDefault()
      window.alert('忘记密码？自己想办法...')
      window.alert('要不重新注册一个吧')
    })
    $('#login_form').on('submit', function (e) {
      e.preventDefault()
      if(email.val() == ''  ) {
        email.prev().html('请输入您的邮箱')
      }else if(password.val() == ''  ){
        password.next().html('请输入您的密码')
      }else{
        var formData = $(this).serialize()
        $.ajax({
          url: '/login',
          type: 'post',
          data: formData,
          dataType: 'json',
          success: function (data) {
            err_code = data.err_code
            switch(err_code){
              case 0: {
                window.alert('登录成功！')
                window.location.href = '/'
              }; break
              case 1: window.alert('邮箱或者密码错误！');break
              case 2: window.alert('该邮箱未注册，请注册！');break
              case 500:window.alert('服务器忙，请稍后重试！');
            }
          }
        })
      }
    })
  </script>
</body>

</html>
